<style>
  .bottom-nav {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background-color: #fff;
    border-top: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 0px 0;
    z-index: 1000 !important;
    height: 48px !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
  }

  .bottom-nav::before {
    content: '';
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 40px;
    background: #fff;
    border-radius: 40px 40px 0 0;
    z-index: -1;
  }

  .bottom-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #666;
    flex: 1;
    position: relative;
    height: 40px; /* 固定高度 */
    padding: 4px 0;
    box-sizing: border-box;
    margin: 0;
    border: 0;
    outline: none;
  }

  .bottom-nav-item.active {
    color: #ff6900;
    /* 确保激活状态与非激活状态高度一致 */
    height: 40px;
    padding: 4px 0;
    box-sizing: border-box;
  }

  .bottom-nav-icon {
    width: 24px;
    height: 24px;
    margin-bottom: 2px;
    display: block;
  }
  .bottom-nav-icon-one {
    width: 60px;
    height: 60px;
  }

  .bottom-nav-text {
    font-size: 10px;
    text-align: center;
    line-height: 1;
    margin: 0;
    padding: 0;
    display: block;
  }

  .bottom-nav-badge {
    position: absolute;
    top: 0;
    right: 20px;
    background-color: #ff4400;
    color: white;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 10px;
    min-width: 16px;
    text-align: center;
  }

  .bottom-nav-sell-btn {
    background-color: #ff6900;
    color: white;
    border-radius: 50%;
    font-size: 10px;
    font-weight: bold;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: -15px 8px 0 8px; /* 负的top margin让按钮向上凸起 */
    position: relative;
    z-index: 1001;
    padding: 0;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  }
</style>

<div class="bottom-nav" id="global-bottom-nav">
  <a href="index.html" class="bottom-nav-item active" data-tab="home">
    <img class="bottom-nav-icon" src="image/bottom_nav/ic_tabbar_home_sel.png" alt="闲鱼">
    <span class="bottom-nav-text">闲鱼</span>
  </a>
  <a href="local.html" class="bottom-nav-item" data-tab="city">
    <img class="bottom-nav-icon" src="image/bottom_nav/ic_tabbar_city_nor.png" alt="济南">
    <span class="bottom-nav-text">济南</span>
  </a>
  <a href="#" class="bottom-nav-sell-btn" data-tab="sell">
    <img class="bottom-nav-icon-one" src="image/bottom_nav/no_privacy_login_icon.webp" alt="">
  </a>
  <a href="message.html" class="bottom-nav-item" data-tab="message">
    <img class="bottom-nav-icon" src="image/bottom_nav/ic_tabbar_message_nor.png" alt="消息">
    <span class="bottom-nav-text">消息</span>
  </a>
  <a href="center.html" class="bottom-nav-item" data-tab="my">
    <img class="bottom-nav-icon" src="image/bottom_nav/ic_tabbar_my_nor.png" alt="我的">
    <span class="bottom-nav-text">我的</span>
  </a>
</div>